Hace días en la entrada "Añadiendo vídeos con Lytebox" surgieron algunas preguntas que trataban sobre la forma de añadir los archivos en la plantilla. Todo está explicado aquí y pensaba actualizar la entrada pero, para no crear confusión he pensado que mejor sería explicarlo en lugar aparte.
Vamos a añadir los archivos directamente a la plantilla y en un gadget, de esta forma prescindimos de alojamiento externo y de los problemas que suelen ocasionar.
1º Copiamos el contenido de este archivo y lo pegamos en el interior de un gadget HTML/Javascript guardamos los cambios y arrastramos el gadget sobre las entradas. Lo que hicimos fue añadir el script en formato txt.
Si preferimos añadirlo directamente a la plantilla podemos añadirlo justo antes de </head> con la diferencia que añadimos lo marcado en negrita a continuación:
<script type='text/javascript'>
// <![CDATA[
Contenido de archivo
...................
...................
//]]>
</script>
<script type='text/javascript'>
// <![CDATA[
Contenido de archivo
...................
...................
//]]>
</script>
2º En plantilla Edición de HTML nos situamos justo antes de </head> y pegamos el contenido de este otro archivo que son los estilos de la ventana modal.
En los estilos debemos añadir las imágenes para las funciones de la ventana modal que podéis conseguir botón derecho sobre la imagen, guardar como...
Las añadimos en los estilos teniendo en cuenta que cada imagen tienen un nombre y al mismo tiempo un color.
Por ejemplo.. donde dice:
#lbClose.grey { background: url(images/close_grey.png) no-repeat; }
Copiamos la url de la imagen
y la añadimos donde dice images/close_grey.pngSería algo así:
#lbClose.grey { background: url(url-imagen-close_grey.png ) no-repeat; }
Como entiendo que puede parecer confuso incluir las imágenes quise aligerar un poco el trabajo, añadí las imágenes en color gris (grey) y eliminé código que no era necesario. El resultado lo podéis copiar de este archivo de texto y añadirlo justo antes de </head>
3º El resto sigue siendo lo mismo, para añadir un enlace utilizamos la etiqueta rel="lytebox"
<a href="Url-de-la-imagen" rel="lytebox" title="Título">texto o imagen</a>¿Cómo añadimos una imagen en lugar de texto?
Sustituyendo texto o imagen por <img src="url-imagen">
Por lógica si lo que vamos a mostrar es una miniatura la imagen tendría que ser de menor tamaño que la original que mostramos en la ventana modal, para obtener la miniatura y no vernos obligados a reducir la imagen lo que podemos hacer es "obligarla" a mostrarse en un tamaño determinado.
<img style="width:150px;height:200px;"src="url-imagen"/>
Con width le damos anchura y con height altura.
En grupos de imágenes añadiendo la etiqueta rel="lytebox[gema]"
Sustituyendo gema por el nombre adjudicado al grupo de imágenes ejemplo: paisajes, flores...
<a href="Url-de-la-imagen" rel="lytebox[gema]" title="Título">texto o imagen 1</a><a href="Url-de-la-imagen" rel="lytebox[gema]" title="Título">texto o imagen 2</a><a href="Url-de-la-imagen" rel="lytebox[gema]" title="Título">texto o imagen 3</a>Crear un Slideshow añadiendo la etiqueta rel="lyteshow[gema]"
(Sustituir gema por el nombre adjudicado al grupo de imágenes) ejemplo: viajes, vacaciones...
<a href="Url-de-la-imagen" rel="lyteshow[gema]" title="Título">texto o imagen 1</a><a href="Url-de-la-imagen" rel="lyteshow[gema]" title="Título">texto o imagen 2</a><a href="Url-de-la-imagen" rel="lyteshow[gema]" title="Título">texto o imagen 3</a>Añadir un iframe con la etiqueta rel="lyteframe"
<a href="iframe-único" rel="lyteframe" title="Título">texto o imagen</a>Al usar lyteframe podemos añadir barra de scroll y escoger tamaño, lo haremos con la etiqueta rev
<a href="Url-de-la-pagina" rel="lyteframe" title="Título"rev="width: 400px; height: 300px; scrolling: no;">texto o imagen</a>Y por último añadimos un vídeo
<a href="http://www.youtube.com/v/wRKPcx9Cpe8" rel="lyteframe" title="Título"rev="width: 400px; height: 300px; scrolling: no;">texto o imagen</a>En negrita lo sustituimos por la url de nuestro vídeo.
La demo de estos ejemplos la podéis ver en el siguiente blog de pruebas.
gema maravilloso blog, pero aunque mi pregunta no tenga mucho que ver con tu post ...necesito que me digas como puedo hacer marcas de agua en mis fotos y con que programa o no se...lo siento soy super torpe lo necesito realmente y he acudido a ti para ver si me puedes solucionar el problema...un abrazo coral!
yz Hola Coral hay páginas online donde subes las fotos y puedes añadir una marca de agua, mira esta es una de ellas.
Personalmente yo lo hago con http://picasa.google.com/ no es que sea algo del otro mundo pero se puede añadir texto con un efecto transparente y queda bastante atractivo ;)
No sé como validar blog,con tantos cambios me pierdo, necesito ayuda...pretendo que la información sobre alimentos transgénicos llegue a muchas personas,...pero desconozco como promocionar blogs, tal vez falten datos en la plantilla, Un cordial saludo
Hola Gema traté de bajar el archivo zip (donde están las imágenes)pero no funciona, estoy por hacerlo en un blog de pruebas porque necesesito algo así, ¿conoces otra opción que se llama sexy lightbox? me gusto cuando la vi, esta en www.coders.me
Me parece que la forma de instalarla es igual, si es así avisame para probar con ese modelo. Gracias por compartir todo lo que sabes ya que es una gran ayuda para nosotros los que aún andamos en pañales en esto de los blogs.
Un abrazo desde Argentina
yz Saludos MaCaPe normalmente todos empezamos por dar de alta el blog en buscadores mira aquí como hacerlo, partiendo de ahí podemos intentar mejorar algunos aspectos como por ejemplo mira optimizar los títulos, también puedes darle una miradita a esta entrada sobre Sitemap ;)
Sería maravilloso que me saliera bien, aunque me llevará pruebas y tiempo así que lo dejaré para más adelante.
Me encanta,me gusta mucho.
Gracias gem@, ya te contaré:)
yz Susy es la forma más sencilla y eficaz de añadir una ventana modal, tan sencillo como copiar y pegar sin buscar alojamientos externos y lo que es mejor el blog va mucho más rápido.
Cuando lo intentes, ya sabes cuaLquier cosa aquí estamos :D
Hola Gema, quiesiera preguntarte algo, aunque no tiene que ver con esta entyrada.
¿De que tamaño debe ser la imagen de la cabecera de un blog para adaptarla para que quede exacta?
Deseo modificar la imagen para que quede en la cabecera de este blog:
http://alfaro-laciudadsinnombre.blogspot.com/
Pero no se que tamaño colocarle.
Si puedes decirme esteré muy agradecido.
Gracias.
Sí Gem@, no dudes que me pondré a ello en cuanto pueda y, como siempre, cuento contigo, aunqu espero que no :O jajaja.
yz KIREI llevas razón, el enlace estaba roto :O
Sobre Sexy Lightbox no la he probado requiere el framework Mootools 1.2.2 o jQuery 1.3.2 y es incompatible con otras librerías como Scriptaculous que es la que suelo usar.
De todas formas si tienes interés en usar esa ventana puedes encontrar orientación aquí ;)
yz Hola Fero el tamaño de la imagen en la cabecera lo encontramos en
#header-wrapper {
width:660px; "Este es el ancho"
margin:0 auto 10px;
border:1px solid #ffffcc;
Aunque el tamaño lo podemos ajustar si la imagen la subimos con el gadget de "Cabecera" marcando donde dice "Reducir hasta ajustar" ;)
yz Suerte Susy ;)
}
yz KIREI ya está solucionado el enlace :D
Gracias Gema, ahora lo bajo y veo si me sale el slideshow.
muchas gracias gema!!!!! :)
Hola Gema Muchisimas Gracias por la informacion y sobre todo por tu gran ayuda.
Por cierto el enlace del ZIP, no me deja descargarlo, supongo que nuevamente esta roto...
Un beso y Muchas Ggracias..
yz He cambiado el archivo de las imágenes de alojamiento espero que ahora no haya problemas :D
hola gem@ acabo de probar de esta manera, es verdad el blog cargo un poco mas rapido pero no me funciona el efecto, al clikear en una imagen como que se bloquea.
Por otro lado creo que me genera algun conflicto con los videos que temgo posteados ya que desde que hise los cambios estos los videos no cargan
Omitir el comentario anterior, era problema de la maquina, realise un pequeña limpiesa y entre nuevamente a mi blog y funciona todo correctamente, probado en safari (windows) y google chrome.
Muchas Gracias Gem@!
Aunque para descargar el archivo me pide una Password...
Hola Gema¡
Estoy intentando bajar el archivo zip, y me dice: "This file is password protected.".. ¿Requiere contraseña para bajarlo? En ese caso, ¿cual es?
yz Me alegra que esté resuelto el problema P4BLQ :D
yz Sharon y Formador Ocupacional tengo problemas para mostrar el zip de las imágenes pero en el archivo que proporciono al final donde dice
"El resultado lo podéis copiar de este archivo de texto ... "
Se trata del archivo con las imágenes añadidas.
De todas formas sigo intentando alojarlo, si queréis algún color en concreto me lo comentáis y os las mando ya mismo :)
Ok, probare con las has puesto por defecto, ya te comento Gema!!
Gracias de nuevoooo ¡¡¡ :-D
yz Esperando estoy :D
Solo hay una palabra para expresar este post:
BRUTAL! funciono a la primera principalmente con los videos de Youtube.
muchas gracias
yz Gracias Henry es muy agradable leer eso porque esta entrada requiere bastante tiempo :)
Si pero no, ahora no abre como al principio se tranca y demora un poco, lo que me fruata es que aqui o en otros blog funcionan de las mil maravillas abre rapido carga las fotos rapido, ya estoy decistiendo de esto, creo que regresare a la forma anterior
Gem@! Muchisimas Gracias...
Tu explicacion esta excelente, me lo he aplicado a mi blog y me va estupendo, Mil Gracias por compartir tus conocimientos y por tomarte el tiempo a responder nuestras dudas.
Besos.:)
yz P4BLQ he vuelto a acceder a tu blog y el grupo de imágenes carga muy rápido :O
yz Sharon te queda estupendo :)
¡¡Gracias a ti por comentar!!
Pero una duda... ¿Como se hace para que se muestren dos paginas como en el ejemplo?
No se si me lograste entender, me refiero al ejemplo ese de Google y Wikipedia
yz Roberto Caamaño un poco más abajo de cada ejemplo verás el código que es necesario añadir, para conseguir mostrar una página o el número de páginas que desees mostrar :)
No se a que se deba,por ejemplo yo entro y se traba demora unos segundos en cargar luego utilisando un programa para limpiar la maquina(los que booran cache,cookies,historial,etc) y entro nuevamente y funciona bien, pero no como para decir que carga muy rapido, eso a de ser por la coneccion a internet o la pc que tienes tu que carga muy rapido.
yz P4BLQ uno de los factores es la conexión pero ahí no podemos hacer nada. ¿Has preguntado a alguien más? :(
yz Miguel Angel Gallego Caro prueba a cambiar también el nombre del color en los estilos donde añadiste las imágenes.
Por ejemplo dice en tu plantilla...
#lbPlay.grey { background: url(http://sites.google.com/site/formadores2009/Home/play_green.png) no-repeat; }
Sustituye grey por green y vemos si así resulta, puedes probar con una sola imagen y ver el resultado antes de cambiar todas.
#lbPlay.green { background: url(http://sites.google.com/site/formadores2009/Home/play_green.png) no-repeat; }
Ya me dirás se es eso para que sigamos mirando :)
Gema, despues de mucho luchar pude incluir un slide en un post conLytebox...aunque me queda un espacio muy grande entre las imagenes y el texto del post...por que será? no tengo ya nada para borrar entre las url de las imagenes y el texto!!
http://apemartinez.blogspot.com/
Gracias por tu ayuda
MAtilde
yz Saludos APE ese espacio lo produce un DIV es un bloque que añade esa etiqueta cuando la añadimos. En este caso ocurre cuando en la posición de Redactar justificamos y damos estilos al texto.
Si te fijas en mis ejemplos también hay un espacio mayor al resto del interlineado justo después de cada efecto con Lytebox (pero menor al que se ve en tu blog)
Intenta situarte en el editor de entradas en la pestaña de Edición de HTML y desde ahí ordena de forma que entre el Slideshow y el texto siguiente no quede ninguna línea libre.
Desde ahí mismo SIN cambiar a Redactar dale salida a la entrada y verás como queda menos espacio.
Espero que resulte bien ;)
Hola Gema¡
Me acaban de informar de un problema importante para respecto de este metodo para ver los videos. Yo lo tengo puesto en mi pagina y funciona perfectamete:
http://formadores-ocupacionales.blogspot.com
Y una amiga ahora mismo me acaba de informar que la ventana del reproductor se queda con el fondo blanco y no carga.. así que lo primero que me ha venido a la mente es el navegador: Con el Firefox va perfectamente, lo he probado con Opera y Crome y lo mismo, sin problema.. pero con el Explorer y como me ha comentado mi amiga.. ¡¡llegan los problemas!! Tengo la ultima versión instalada y efectivamente el reproductor sale pero se queda la pantalla en blanco, como si estuviera cargando pero no hace nada.. pufff, despues del palizon que me he pegado ahora no se ven en el Explorer..
¿Alguna idea para solucionarlo? ¿Alguien me puede confirmar si le pasa lo mismo con el Explorer? Gracias ¡¡
Acabo de probar versionasmas antiguas del Explorer y sigue sin funcionar... ¿Que se puede hacer al respecto?
yz Estoy probando Ismael, es algo que no entiendo porque probé con Explorer los vídeos.
Por lo pronto voy a repasar en la plantilla algún error que ha visto J.Miur.
Cualquier cosa te comento aquí mismo ;)
yz Ismael, consulté tu problema con J.Miur, y me comenta que podía ser el script de JQuery que hace subir la página. Compruébalo eliminando el script provisionalmente y vemos si se soluciona :O
Ya he realiado la prueba, he quita el JQuery de "Ir Arriba" que tenia puesto..y nada, el mismo fallo en Internet Explorer.. así que lo he vuelto a poner..
yz Sigo mirando Ismael, el vídeo se añade por medio de un iframe y en los ejemplos se muestra el iframe sin problemas.
Siento este problema pero debe tener una explicación y la estoy buscando ;)
yz Me olvidaba decirte que he probado en una plantilla sin scripts y el vídeo se ve perfectamente con Explorer, es algún conflicto con otro scripts que podemos tener en la plantilla.
Osea, que puede que ser que cualquiera de los scrpts que tengo sea el que me este dando problemas? :O .. puff, y que hago ahora? pq ni me acuerdo ya de las cositas que ido modificando estos meses.
yz Sinceramente no sabría decirte, sigo haciendo pruebas incluso J.Miur está intentando ver donde está el error pero co ncerteza aún no sé nada.
Lo que puedes hacer es mostrar el vídeo sin ventana modal y cuando tenga una solución no dudes que te la haré llegar :)
Gema, te puedo pasar el login y contraseña de mi pagina para que la mires y me digas que puede fallar? creo que sera la unica forma de saberlo.. si aceptas dimelo y te la envio al correo de forma particular.. sino.. me tocara cambiar todos los videos.. con lo bonito que quedaba el recurso... :( Lo que tu veas.
yz Hola Ismael, hay ningún problema en acceder a tu blog pero eso no va solucionarlo.
Como te decía ayer J.Miur estuvo también intentando dar con la solución sin resultado alguno.
Ya sabíamos que Lytebox no está preparado para mostrar vídeos pero yo pensaba que si está preparado para mostrar iframes el vídeo podía mostrarse en un iframe y hasta ahí eso está bien, los problemas vienen cuando se trata de mostrar un reproductor de Flash.
No me había dado cuenta de ese problema porque se presenta cuando se trata de mostrar los vídeos en páginas individuales (en la página principal se ve correctamente)
Siento si te hice trabajar y por mi error te ves ahora con este problema :(
Me veo en la misma situación que tú, y tengo que pensar lo que voy a hacer porque me gusta Lytebox y lo voy a seguir usando.
Tengo que buscar una opción para los vídeos que no ocasione problemas con Lytebox y no recargue mucho la carga de la página.
Lo siento de veras...
No te preocupes Gema, bastante te lo has currado para tratar de que lo comprendieramos todos en el foro!! Sin problema, los exportare directamente del youtube otra vez (como lo tenia antes) y sin problema. ;)
Lo que si me gustaria es que cualquier cosita que pudieras descubrir sobre nuevos metodos para ver videos sin cargar las paginas lo dejares caer por aqui!! Creo que en eso estamos todos interesados!!
Y lo dicho... aun así, buen aporte para hacerlo funcionar en una pagina principal!! :D
yz Gracias por tomarlo así Ismael :D
La idea era buena y la intención mejor pero Explorer juega esas malas pasadas.
Para ver vídeos hay otras opciones como iBox
http://gemablog-.blogspot.com/2008/05/ibox-ventana-modal-muy-liviana.html
La cuestión es que no permite Slideshow y no resulta en mi opinión tan atractiva como Lytebox.
Pero hay otras muchas sólo hay que buscar la más acorde a nuestra necesidad, te mantendré informado.
Ok, gracias Gema! Usare mientras tanto la opción que has recomendado (iBox), y como has dicho, no resulta tan atractiva como Lytebox, pero mientras tanto.. la usare¡¡ ;) Mejor esto que pegar directamente la pantalla del Youtube¡¡ :S Y para fotos mantendre Lytebox. :)
Y gracias por mantenernos informados¡¡ :D
¿Cual de los códigos debería añadir ya que hará referencia a todas las imágenes del blog porque la url de la imagen no creo que sea y en lo referente al texto que debo escribir?
yz Ismael eso es justo lo que yo pensaba hacer, aunque sigo probando y preguntando por aquello que se llega a Roma :D Si consigo llegar daré señales :)
yz Unhidalgo para mostrar la ventana en imágenes hay que añadir el que dice:
3º El resto sigue siendo lo mismo, para añadir un enlace utilizamos la etiqueta rel="lytebox"
He editado la entrada para mostrarte de qué forma podemos añadir una imagen e nminiatura en lugar de texto.
Los cambios no se van a mostrar en todas las imágenes del blog, sino en aquellas que añadas rel="lytebox en su enlace, es decir que previamente añadas el código
<img style="width:150px;height:200px;"src="url- de -la imagen"/>
No olvides que también debes añadir el script y los estilos de la ventana modal :)
Hola Gema nuevamente por acá...Esta vez quisiera preguntarte en donde se modifica el tamaño de la imagen cuando se abre la ventana modal, es por defecto? depende del tamaño real?
Gracias!!
Si tengo que hacerlo en todas las imágenes me llevará bastante tiempo y como que no me apetece.
1000000000000000 Muak
Hola Gema!
Me ha pasado algo muy raro.. he probado a cargar mi pagina con el explorer, y mira que ha pasado¡¡ se ve a trozos!! Los los demas navegados no pasa (firefox, opera, safari, chrome) se ve perfecto con ellos.. pero con el explorar mira que desastre¡¡
He probado a cargar codigos de la plantilla que tenia guardados (antes de cada modificación hago una copia de seguridad) pero nada, con ninguna se ve bien, lo curioso es que solo afecta a la pagina principal pq si pinchas cualquier post.. ¡se ve todo bien otra vez!
¿Alguna idea de por me puede pasar esto gema?
Gracias gema.
yz Hola APE, el tamaño de la ventana se modifica en lbOverlay el ancho viene definido con width: 100% el alto lo podemos escoger en height.
yz Unhidalgo pues se deja a la espera que apetezca o se deja como está :)
yz Ismael Parras Ramirez la idea es que no toques nada y actualices el navegador, con Explorer8 se ve perfecto :)
Hola Gema... efectivamente... se ve perfecto, pero de golpe, sin tocar nada, igual que ahora.. ¡Otra vez no se ve! Pero bueno, que pasa con Internet Explorer, ¿hay alguien mas a quien le esta dando problemas esporadicos?
yz ¿Te pasa siempre desde el mismo PC?
Lo he probado en diferentes pc's.. y si, ahora mismo no se ve.. y no se pq puede ser la verdad.. en todos los demas navegadores se ve perfecta (firefox, opera, chrome, safari) pero en internet explorer.. ya lo estas viendo.. ¡¡ que desastre !! Me da mucha rabia pq estoy seguro que mucha de la gente que le puede interesar mi pagina no se van a instalar ningun otro navegador.. en fin, nose..y da igual la version que tenga, en todas se ve.. pues así.. pero es curioso, si pincho sobre el enlace del post que sale, ya carga el resto de la pagina bien, osea que el problema es de la pagina principal.. esto me supera, lo reconozco. puff
yz Vamos a probar una cosa, añade antes de </head> (justo antes) lo siguiente:
<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script>
<![endif]-->
Ya me dices algo :O
Lo acabo de probar gema.. sigue sin funcionar.. ahora mismo lo tengo puesto, puedes verlo si quieres.. :( que mala suerte estoy teniendo con el explorer, y lo peor es que casi todos mis alumnos, por ser adultos y estar en proceso de reciclaje de diferentes sectores, no entiende de informática y no se atreven a instalar otro navegador.
Lo mismo es una tontería como un piano en el código HTML.. pero llevo poco tiempo con esto y ya me puede golpear en la cabeza que no lo vería, ¿le darías un vistazo rápido (no quiero quitarte tiempo, ya sé que tendrás el correo saturado!!) por si tú que puede estar causando el conflicto?
Y gracias por todo gema, te estás portando de 10, de verdad!
Gema ya que el otro no me fucionò use este pero naddda... :( por què? auxilio...
Te mande los datos de mi blog a tú dirección de correo, ... te rogaria que me dijeras algo.. Gracias Gema!!!
yz ¿Qué es en concreto lo que no te funciona Global Metion?
yz Recién llego de pasar unos días fuera Ismael, busco ese correo y veo lo que puedo hacer pero lo veo complicado. Ya te digo algo ;)
TODO NO SE ABRE EN LA VENTANA MODAL SINO QUE SOLO COMO NORMALMENTE EN OTRA:(
yz Global Metion no veo en tu blog ningún enlace con rel="lytebox" :O
Gema decidí mandarte un E-amil allí me entenderas mejor se llam "Ayuda con las imágenes, GMB" porfa contesta :P
yz Global Metion Blog te he enviado la respuesta ahora mismo ;)
Gracias por todas las molestias que te estás tomando Gema.. eres un sol!! ;)
Efectivamente, tenía dos enlaces en googlepage que no funcionaban, formaban parte de la plantilla que me baje, así que no tengo dichos ficheros. He eliminado las líneas y todo sigue funcionando igual (lógico, si ya no funcionaban antes), ¿pudiera ser esta la causa del desbarajuste?
yz No Ismael, unos enlaces rotos no ocasionan ese problema. Añadí la plantilla esta tarde pero me tuve que ausentar, voy ahora a darle un vistazo.
Gema aquí está la entrada http://globalmention.blogspot.com/2009/06/aca.html
no sé que pasa
yz Global Metion Blog ¿tienes algún script de jQuery en la plantilla? te lo digo porque Lytebox lo tienes perfectamente añadido y tal y como lo tienes me está funcionado en mi blog de pruebas.
Por otra parte y esto no tiene nada que ver he visto que tienes repetido el script de anniyalogam y el enlace está roto, compruébalo.
si es el de mis emoticonesde Yahoo pero ese truco me encnata no sé que hacer
yz Quizás pueda sustituirse por otro script para emoticones, te he enviado un mail.
Gema a que no me crees esto pero se me ocurrio yo siempre ando de... y puse el de la modal en body
y el de los emos en head y funciono:0 no lo puedo creer :)
yz Se ve perfecto ahora !! :D
Resulta que ahora se ve la plantilla perfectamente en el explorer, pero no he tocado nada... puff, que mosqueante!!, aun así me salen 2 errores:
1.)Detalles de error de página web:
Agente de usuario: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; OfficeLiveConnector.1.3; OfficeLivePatch.0.0; InfoPath.2)
Fecha: Wed, 1 Jul 2009 23:31:08 UTC
Mensaje: El objeto no acepta esta propiedad o método
Línea: 667
Carácter: 1
Código: 0
URI: http://formadores-ocupacionales.blogspot.com/
Mensaje: 'offsetWidth' es nulo o no es un objeto
Línea: 277
Carácter: 7
Código: 0
URI: http://img22.xooimage.com/files/c/0/c/ibox-fec618.js
2.) Detalles de error de página web:
Agente de usuario: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; OfficeLiveConnector.1.3; OfficeLivePatch.0.0; InfoPath.2)
Fecha: Wed, 1 Jul 2009 23:33:51 UTC
Mensaje: El objeto no acepta esta propiedad o método
Línea: 667
Carácter: 1
Código: 0
URI: http://formadores-ocupacionales.blogspot.com/
Mensaje: 'offsetWidth' es nulo o no es un objeto
Línea: 277
Carácter: 7
Código: 0
URI: http://img22.xooimage.com/files/c/0/c/ibox-fec618.js
¿A que se refieren estos errores?
yz Puede ser lo que yo vi y pensaba que te había recomendado y es que añadas el script de iBox antes de </head> si ves que interfiere con Lytebox prueba a llevar el último antes de </body>
El otro error no sé que puede ser :(
... joder, ya decia yo.. La página de inicio se ve bien ahora.. pero si pinchas en "ENTRADAS ANTIGUAS" se vuelvo a comer la barra lateral derecha y la zona de abajo.. :O
yz Te he enviado un mail Ismael ;)
Gema queria saber si había alguna forma de que las fotos abiertas en la ventana modal se vieran al tamaño de las originales y que se pudieran guardar, pues ahora se ven mas pequeñas y no permiten esa función...
Gracias Gem@, funciona perfectamente. Lo estoy usando en mi galería :D http://euryae.blogspot.com/2009/03/galeria.html
Voy a estar visitándote seguido...
¡Saludos desde Argentina!
yz Las propiedades de la ventana viene definidas en la hoja de estilos Global Metion Blog, te recomiendo hacer las pruebas en otro blog sobre todo si lo tienes añadido a la plantilla ;)
yz Me alegra que resultara bien Euryae :D
Se queda cargando la imagen y no me aparece nada.
http://pruebatrailers5.blogspot.com/2009/08/prueba-1-funciona.html
¿A alguien más le ha pasado y tiene la solución?
Gracias.
yz Neo estás utilizando para la imagen que se visualiza el código que proporciona Blogger en el editor, ese es el problema.
Prueba de esta forma:
<a href="url imagen ampliada" rel="lytebox" title="Título">
<img style="width:300px;height:400px;"src="url imagen miniatura"/></a>
Hola Gema.
Me sigue pasando lo mismo. He cambiado los parámetros como me ponías en tu comentario, pero el resultado sigue siendo el mismo.
¿Se te ocurre alguna otra cosa?
yz Neo he comprobado los estilos y el script y está perfecto, lo único quee veo es que añades medida a la imagen cuando la muestras en el mismo tamaño aunque eso no es el motivo.
Prueba de esta forma:
<a href="http://1.bp.blogspot.com/_jhhmQQpFLP8/SoBIQh_s8ZI/AAAAAAAAADY/Mt2KQ488ikA/s400/shutter_island_ver2.jpg" rel="lytebox" title="Título">
<img style="width:300px;height:400px;"src="http://1.bp.blogspot.com/_jhhmQQpFLP8/SoBIQh_s8ZI/AAAAAAAAADY/Mt2KQ488ikA/s400/shutter_island_ver2.jpg"/></a>
Y otra cosa... la url de la imagen de carga muestra un enlace roto, aloja la imagen en otro sitio y sustituye la url que tienes ahora por la nueva.
Puedes descargar la que hay en esta misma entrada :D
Perfecto Gema, muchas gracias por tu ayuda y paciencia.
Vas a decir que soy un pesado pero me queda todavía una cosita por realizar, haber si tú sabes como realizarlo.
En el siguiente blog de pruebas:
http://pruebadetrailers.blogspot.com/
Al pinchar en entradas antiguas, los post que he creado anteriormente se ven en forma de lista y no como en la página principal del Blog.
¿Hay alguna forma para que los post que no están en la página principal se vean de la misma forma que esta?
Además si haces una busqueda en el buscador que tengo también aparece en forma de lista, así como si pinchas en una de la Etiquetas, también pasa lo mismo. Y es que yo creo que es más elegante que se viera el póster con el título que en formato listo.
Si no tienes tiempo lo entiendo, no te preocupes, ya que somos muchos los que te preguntamos sobre problemas en nuestros blogs.
De todas formas ya lo he puesto el blog en funcionamiento y a partir de hoy empezaré ha colocar las imágenes con este truco que tienes aquí colocado. El blog es:
http://trailersyestrenos.blogspot.com/
Una vez más muchísimas gracias por tu rápida atención y dedicación.
De nuevo problema :O
En el blog oficial no me vuelve a pasar lo mismo
http://trailersyestrenos.blogspot.com/2009/08/el-hombre-lobo-trailer-vo.html</b
yz Hola Neo, sobre la forma de ver los post en las páginas individuales yo creo que es así en las plantillas Magazine pero no estoy segura.
Lo ideal sería que lo comprobaras en la plantilla original, en la demo del autor.
No veo problemas en el código de la imagen:
<a href="http://bp1.blogger.com/_ZIEE9hMH7x4/SJiIrT--HnI/AAAAAAAADbg/Q4xnUtiVHkI/s400/the-wolfman.jpg" rel="lytebox" title="El hombre lobo (Teaser Póster USA)">
<img src="http://bp1.blogger.com/_ZIEE9hMH7x4/SJiIrT--HnI/AAAAAAAADbg/Q4xnUtiVHkI/s400/the-wolfman.jpg"/></a>
Comprueba el script o intenta con este que te he dejado más arriba ;)
Hola! Acabo de leer todos los comentarios de esta entrada y quería decirte que admiro tu labor y dedicación... eres una artista!
=)
Por cierto, me ha encantado el vídeo de la fabricación de canicas!
:)
yz Muchas gracias Brochazos es un detalle tu comentario :D
Me gustan esos vídeos que nos descubren como se hacen las cosas, lo veo muy curioso.
No tengo muchos vídeos pero si te gustan y quieres verlos los tengo guardados en:
http://www.youtube.com/Gemablog :)
Hola.
Muy bueno el post.
Lo estoy probando, muchas gracias. La lupa la dejo para otro día ;-)
Pablo
yz Gracias Pablo, espero te resulte bien :)
quedo perfecto, muchas gracias :)
yz Pues si que te quedó perfecto Gearheads :)
Hola Gema la verdad que al blog esta aplicacion le da algo diferente,, algo muy lindo.
En cuanto a la consulta quería preguntarte que al poner los códigos todo bien me abre la imagen con el efecto correspondiente. Osea que la funcion esta todo bien. El problema es entre mi menu horizontal y la parte de los post me deja un espacio no muy grande pero visible. ¿Ahi alguna forma de solucionarlo?
yz Tendría que ver eso que me comentas Gonzalo :O
Hola Gema! Estoy haciendo un blog donde iré subiendo mis dibujos y otras imagenes durante el curso, me gustaría poder utilizar este Litebox para verlas porque es muy bonito, pero no lo consigo.. ya me estoy volviendo loca.
Me lo he repasado todo y no se donde esta el fallo, el blog es reciente y la plantilla, la predeterminada de blogger. Podrías ayudarme? Te estaría muy agradecida de corazón.
mi blog es: http://esbozosydibujos.blogspot.com/
No dejaré de leerte! Besitos.
Estoy asta yo sorpendida, ahora me funciona bién!! creo que fué un mal cierre de un script, o alguna novata..:$
Es normal que en el internet explorer 8 no se me vean las imagenes de cierre etc. Porque en el firefox funcionan perfectamente, hay alguna solución para esto? estaré atenta a tu respuesta, muchas graciass.
:: Hola Pilar queda muy bonito ese efecto para mostrar los dibujos de verdad.
El problema que me comentas y ya has solucionado suele ocurrir cuando la página no carga completamente, cualquier ventana modal si marcamos sobre la imagen y la página no ha cargado entera nos lleva a la imagen pero sin efecto.
Estuve mirando con Explorer 8 y veo igual de bien que con Firefox :D
Mira si tienes actualizado tu navegador puede que sea eso ;)
Gracias gema! Estoy probando cositas nuevas.. Ah por cierto me gusta mucho tu blog, lo encuentro muy entenedor :D ya que todo esta muy bien explicado para novatillas como yo jeje
Es super muy útil, tiene un sin fin de material para blogger recopilado. Piensa que ya soy un fan asiduo a tu blog :D y no dejaré de leerte!
Muchas gracias, por ser tan atenta.
besitos.
:: Gracias por el comentario Pilar :)
Hola Gema, me quedo una duda respecto a esto..
:: Que tengo que cambiar en las imagenes para que tenga el efecto modal?
::Es algún codigo?
Gracias :)
:: Hola Andrés, cuando se desea añadir el efecto a una imagen se añade algo así:
<a href="Url-de-la-imagen" rel="lytebox" title="Título"><img style="width:150px;height:200px;"src="url-imagen"/></a>
Donde dice width:150px;height:200px;es el tamaño de la miniatura que puedes modificarlo.
Esa ayudita dio el chispaso en mis neuronas Gem@!
Muchas Gracias! Sos una gran profesora blogger :D
Quiero que sepas que aprecio mucho tu ayuda y te deseo una muy feliz navidad y un próspero año nuevo. Ojala para el año que entra se cumplan tus sueños e ilusiones.
Por este año no te molesto más porque siento que ya avance mucho en mi humilde blog y todo gracias a vos! ;)
Muchas gracias por todo, te saluda tu amigo de blogger: Andrés ;)
:: Gracias Andrés Felices Fiestas!!
Hola de nuevo Gema. Mira estoy creando mi propia página web de Fotografía ya que voy a intentar dedicarme a ello y en la plantilla "Photosplus" de www.btemplates.com la forma de aumentar las imágenes es distinta, estuve mirando haber si encontraba los códigos pero no ha sido posible. Si no es mucho pedir me gustaría que si tu puedes conseguirme los códigos para utilizarlo para mis imágenes, gracias y un saludo.
:: Hola Jonatan se están utilizando en esa plantilla varios scripts. Por lo que he podido ver trabaja con jQuery pero no es algo sencillo de averiguar a simple vista tendría que instalar la plantilla para poder tener las ideas claras y decirte paso a paso como hacerlo.
Gem@ soy aprendiz en cuestiones de diseño y blogs. He puesto en práctica este tutorial pero no he obtendio el resultado que deseaba. Si bien lytebox funciona, no lo hace de la manera en la que pretendo. Mi intención es publicar una fotografía en una entrada y, que esta tenga el efecto de lytebox. El problema es que en la entrada aparece la imagen repetida. Quiero saber como logro colocar sólo una y no dos. Para que comprendas mejor mi caso puedes ver un ejemplo en www.elblogdepruebasderedpeppy.blogspot.com
Muchas gracias desde Argentina
:: RED PEPPY repasa bien lo que añadiste en el post porque se añade sólo una vez el código:
<a href="http://img121.imageshack.us/img121/2413/scr02g.jpg" rel="lytebox"title="León"><img style="width:150px;height:200px;"src="http://img121.imageshack.us/img121/2413/scr02g.jpg"/></a>
Gem@ sólo añadí una vez el código en el editor de entradas. Desconzoco el motivo por el cual la imagen aparece repetida. Tal vez el problema este en la plantilla del blog.
Gracias por tu ayuda
:: Algo mal se está haciendo RED PEPPY porque es la primera vez que sucede eso de repetir la imagen añadiéndola sólo una vez :S
Hola Gema, he estado probando de nuevo con Lytebox pero ya no me sale el efecto. He repetido tus pasos 3 veces y he probado a quitar y a poner mas cosas... pero nada. Y además de que el efecto no me funciona alojandolo todo en mi plantilla, mira lo que me sale: http://lh6.ggpht.com/_pPCb5GFaoKk/TD7Bee6qJiI/AAAAAAAAABw/1-gVN8exmn8/s640/PAINT.PNG ¿Me puedes ayudar?
:: Grupo Jerusalemº en el script de su plantilla sobran dos líneas que las he marcado en negrita:
<script type='text/javascript'>
// <![CDATA[
<script type='text/javascript'>
.....
.....
</script>
//]]>
</script>
:: Grupo Jerusalemº me olvidaba, si las imágenes que añadiste al ejemplo las vas a utilizar lo ideal es que las guardes en tu PC y las alojes en tu servidor o en una entrada del blog porque si yo elimino esas imágenes en tu blog dejarán de visualizarse.
Por otra parte te explico lo siguiente porque imagino que lo desconoces como la gran mayoría de los que nos iniciamos... Si mi alojamiento fuera de pago que no es el caso estarías utilizando espacio de mi banda ancha y con ello disminuyendo mi espacio de alojamiento o haciendo que pagara más cantidad.
Muchisimas gracias Gema. Vamos a ver si sale adelante ésto del blog... jejeje un beso ;)
:: Suerte :)
Hola Gem@!, Estoy haciendome un blog de ilustración y esto lo tengo activado y me va muy bien, pero no se donde tocar ya para ver las imagenes a su tamaño original una vez abiertas. Si me dijeses estare muy agradecido :)
Gracias & Salu2!
:: Necesito ver un ejemplo de tu blog donde esté añadido Moises ;)
si nosotros ya nos conocemos de hace tiempo :P, a lo mejor si te digo StudioM6 te suena mas :D
El tema es que me reduce casi todas las imagenes a un tamaño que no es el sullo y bueno todavia esta en construccion pero aqui te dejo el enlace > moiseismo.blogspot.com
Un abrazo Gem@!
:: Normalmente la imagen se muestra en la ventana a su tamaño original, prueba de forma que las imágenes subidas a Blogger no tenga un tamaño definido por ejemplo si la imagen dice s400 lo dejas en s0 siempre eliminando de forma que se muestre un 0 "cero"
http://1.bp.blogspot.com/_q4j3j-JA2ro/TI_rhu49YVI/AAAAAAAAPes/UJJsyU8enDw/s400/Picture+3.png
:: Moises ahora me doy cuenta de tu comentario completo, así que StudioM6 claro que me acuerdo mucho tiempo sin verte!! :D
Hola de nuevo gem@! :)
He hecho lo que me dices pero sigue dejandome las imagenes igual :( No queda mal en todas, pero se nota mucho mas en las imagenes que son mas altas que anchas. Si se puede hacer algo mas ya me dices y si no pues bueno, muchas gracias de todas maneras... ;)
Salu2!
:: Lo miraré Moisés porque tengo que probar antes de responderte ;)
hola gem@!!!
esta entrada y los comentarios te hicieron trabajar mucho, no???
me estoy haciendo la costumbre de probar primero las cosas en un blog de pruebas. y en el de pruebas funciona muy bien.
pero tengo algunas dudas.
primero: no entiendo muy bien como aplicar esto
3º El resto sigue siendo lo mismo, para añadir un enlace utilizamos la etiqueta rel="lytebox"
texto o imagen
es decir, no se como añadir el rel a un enlace. la forma que lo estoy utilizando ahora en con javascript.
seguramente es una tonteria que no se como usar.
pero lo que realmente me importa es otra cosa.
lo que estoy buscando en realidad es la forma para que la ventana modal se abra automaticamente al entrar al blog por unica vez.
es decir, que al entrar al blog aparezca una ventana con una imagen y al cabo de un click o de un tiempo determinado esta desaparezca.
si me ayudas con esto voy a ser muy feliz.
practicamente desde que cree el blog que estoy queriendo como hacer algo asi.
como siempre gem@ ta agradezco por todo el esfuerzo que te tomas.
:: EpideMia ahí mismo se muestra dónde añadir rel="lytebox en un enlace, por ejemplo un enlace sin rel="lytebox sería:
<a href="Url-de-la-imagen" title="Título">texto o imagen</a>
Y con rel="lytebox:
<a href="Url-de-la-imagen" rel="lytebox" title="Título">texto o imagen</a>
El otro tema que dices desconozco la forma de hacerlo :S
Nota: solo los miembros de este blog pueden publicar comentarios.